<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>图片直播</title>
    <link rel="stylesheet" href="./css/base.css" />
    <link rel="stylesheet" href="./css/index.css" />
  </head>
  <body>
    <div class="headerUrlBox">
      <img src="" alt="" class="headerUrl" />
    </div>
    <!-- 大盒子 -->
    <div class="bigbox">
      <!-- 上半部分 -->
      <!-- 文字 -->
      <div class="wzbox">
        <h3 class="liveName"></h3>
        <div class="xcbox">
          已有<span class="watchNumber"></span>人次浏览了此相册
        </div>
        <div class="hdsj">
          <div class="pic"><img src="./images/时钟.png" alt="" /></div>
          <div class="rq">&nbsp;&nbsp;</div>
        </div>
        <div class="hddd">
          <div class="pic2"><img src="./images/地图.png" alt="" /></div>
          <div class="zj"></div>
        </div>
      </div>
      <!-- 下半部分 -->
      <div class="tabbox">
        <!-- tab栏切换 -->
        <div class="left">
          <div class="tab tab1 tab-active">
            <p>图片直播</p>
            <div class="blue-block"></div>
          </div>
          <div class="tab tab2">
            <p>热门</p>
            <div class="blue-block"></div>
          </div>
        </div>
        <!-- 语言切换排序 -->
        <div class="right">
          <div class="shu">|</div>
          <!-- 二维码 -->
          <div class="erwma">
            <img src="./images/二维码.png" alt="" />
          </div>
          <!-- 语言 -->
          <div class="yy">
            <div class="pic1"><img src="./images/语言.png" alt="" /></div>
          </div>
          <!-- 分类 -->
          <div class="fl">
            <div class="pic2"><img src="./images/分类.png" alt="" /></div>
          </div>
        </div>
        <!-- 图片列表：默认是瀑布流 -->
        <!-- <div class="pics-list"></div> -->
      </div>

      <!-- 图片直播 -->
      <div class="tab-content"></div>
      <!-- 热门 -->
      <div class="poPular" style="display: none">
        <div class="hot-big-pics"></div>
        <div class="hot-small-pics"></div>
      </div>

      <!--宫格式-->
      <div class="palaceGrid"></div>

      <!-- 时间线 -->
      <div class="timeLine" style="display: none"></div>

      <div class="timeLineFx" style="display: none"></div>

      <!-- 图片列表：默认是瀑布流 -->
      <div class="pics-list"></div>

      <!-- 遮罩层 -->
      <div class="overlay" style="display: none"></div>

      <!-- 二维码弹层 -->
      <div class="tc" style="display: none">
        <img class="tcHeaderUrl" />
        <div class="wzBox">
          <div class="tcTitle"></div>
          <!--<div class="realTime"></div>-->
          <!--<div class="address">浙江 宁波</div>-->
        </div>
        <div id="qrcode" class="qrcode"></div>
        <p class="tcWz">扫码观看图片直播</p>
        <button class="sc"><div class="cha"></div></button>
      </div>

      <!-- 语言下拉框 -->
      <div class="select_yy" style="display: none">
        <ul class="select_box">
          <li class="wz show">简体中文</li>
          <li class="wz1">English</li>
          <li class="wz2">繁體中文</li>
        </ul>
      </div>

      <!-- 分类下拉框 -->
      <div class="select_box2" style="display: none">
        <ul class="fs">
          <li class="show pb">瀑布流</li>
          <li class="sj">时间线</li>
          <li class="gg">宫格式</li>
        </ul>
        <ul class="px">
          <li class="zx show">正序</li>
          <li class="fx">逆序</li>
          <li></li>
        </ul>
      </div>

      <!-- 返回顶部 -->
      <div class="back-to-top" style="display: none">
        <div class="back-to-top-text">返回顶部</div>
        <!-- <div class="scroollTo"><img src="./images/返回顶部.png"></img></div> -->
      </div>

      <!-- 加号 -->
      <div class="plusSign">
        <button class="sc"><div class="jia"></div></button>
      </div>

      <!-- 下载 -->
      <div class="downLoad" style="display: none">
        <button class="xz">下载</button>
      </div>

      <!-- 图片点击 -->
      <div class="picDetails" style="display: none">
        <!-- 上半部分 -->
        <div class="top" style="display: flex; justify-content: space-between">
          <div class="help"><img src="./images/帮助.png" alt="" /></div>
          <div class="close"><img src="./images/关闭.png" alt="" /></div>
        </div>
        <!-- 中间部分 -->
        <!--<div class="pic3">-->
        <!--  <img src="" alt="" id="btnImg2"/>-->
        <!--</div>-->
        <div class="swiper">
          <div class="swiper-wrapper">
            <!--<div class="swiper-slide">123</div>-->
            <!--<div class="swiper-slide">345</div>-->
            <!--<div class="swiper-slide">567</div>-->
          </div>
          <!--<div class="swiper-pagination"></div> -->
          <!-- 当前和总页码信息 -->
          <div class="page-info"></div>
          <!--<div class="bottom">-->
          <!--<div class="imgGQ GQBox">加载高清图</div>-->
          <!--<div class="bottomRight">-->
          <!--  <div class="transmit">-->
          <!--    <img src="./images/转发.png" alt="" />-->
          <!--  </div>-->
          <!--  <div class="like"><img src="./images/喜欢.png" alt="" /></div>-->
          <!--  <div class="download">-->
          <!--    <img src="./images/下载.png" alt="" />-->
          <!--  </div>-->
          <!--</div>-->
        </div>
      </div>
    </div>

    <!-- 帮助弹层 -->
    <div class="tool-layout" style="display: none">
      <p><span>文件大小</span>4.85MB</p>
      <p><span>拍摄时间</span>2024-03-23 15:50:44</p>
      <p><span>文件编号</span>DYR_0768.JPG</p>
      <p><span>摄影师</span>丁雅茹</p>
      <p><span>修图师</span>图影</p>
    </div>

    <!-- 选择图片下载的弹层 -->
    <div class="batchDownload-footer" style="display: none">
      <!-- 上半部分 -->
      <div class="batchDownload-footer-select">
        <div class="batchDownload-footer-select-count">
          已选择
          <span class="batchDownload-footer-select-count-hint">0</span>张
        </div>
        <div class="batchDownload-footer-select-confirm">立即下载</div>
        <div class="batchDownload-footer-select-close">取消</div>
      </div>
      <!-- 下半部分 -->
      <div class="batchDownload-footer-hint">最多可以选择99张照片</div>
    </div>

    <!--<div id="loading">正在保存...请稍候</div>-->
    <!---->
    <!--  <div class="swiper">-->
    <!--  <div class="swiper-wrapper">-->
    <!--<div class="swiper-slide">123</div>-->
    <!--<div class="swiper-slide">345</div>-->
    <!--<div class="swiper-slide">567</div>-->
    <!--  </div>-->
    <!--   <div class="swiper-pagination"></div> -->

    <!--  <div class="swiper-button-prev"></div>-->
    <!--  <div class="swiper-button-next"></div>-->
    <!--   <div class="swiper-scrollbar"></div> -->
    <!--</div>-->
  </body>
  <!-- 导入axios -->
  <script src="./lib/axios.js"></script>
  <!--<script src="./js/swiper-bundle.min.js"></script>-->
  <script src="https://dapp.tmuyun.com/oss-static/app/jcommind.js"></script>
  <!--<script src="https://dapp.tmuyun.com/oss-static/app/jcommind.js"></script>-->
  <script src="https://cdnjs.cloudflare.com/ajax/libs/qrcodejs/1.0.0/qrcode.min.js"></script>
  <script src="js/index.js?v=<%= new Date().getTime() %>"></script>
</html>
